// We only need to import the modules necessary for initial render
import CoreLayout from '../layouts/CoreLayout'
import Home from './Home'
import CounterRoute from './Counter'
import ZenRoute from './Zen'
import ElapseRoute from './Elapse'
import RouteRoute from './Route'
import PageNotFound from './PageNotFound'
import Redirect from './PageNotFound/redirect'
import Auth from './Auth'
import LoginComponent from '../components/Auth/login.component';
import {
  RegisterComponent
} from '../components/Auth/register.component';
import {
  App
} from '../components/App';

/*  Note: Instead of using JSX, we recommend using react-router
    PlainRoute objects to build route definitions.   */

export const createRoutes = (store) => {

  let appRouter = {
    path: '/',
    component: CoreLayout,
    indexRoute: Home,
    childRoutes: [
      Object.assign({}, CounterRoute(store), {
        data: {
          auth: true
        },
      }),
      ZenRoute(store),
      ElapseRoute(store),
      RouteRoute(store)
    ]
  };

  // {
  //   path: '/login',
  //   component: LoginComponent
  // }, {
  //   path: '/register',
  //   component: RegisterComponent
  // }

  return ([
    appRouter,
    {
      path: '/login',
      component: LoginComponent
    },
    {
      path: '/register',
      component: RegisterComponent
    },
    PageNotFound(),
    Redirect
  ]);

}

/*  Note: childRoutes can be chunked or otherwise loaded programmatically
    using getChildRoutes with the following signature:

    getChildRoutes (location, cb) {
      require.ensure([], (require) => {
        cb(null, [
          // Remove imports!
          require('./Counter').default(store)
        ])
      })
    }

    However, this is not necessary for code-splitting! It simply provides
    an API for async route definitions. Your code splitting should occur
    inside the route `getComponent` function, since it is only invoked
    when the route exists and matches.
*/

export default createRoutes
